<body style="margin: 0px;">
<div style="zoom: 2; margin: 30px;">
  <div style="background: blue; filter: url(#offset-flood); -webkit-filter: url(#offset-flood); width:200px; height:100px;" src="resources/reference.png">
    <div style="position: absolute; left:200px; top:30px; width:30px; height:40px; background:red;"/>
  </div>
</div>

<svg xmlns="http://www.w3.org/3000/svg" width="0" height="0" xmlns:xlink="http://www.w3.org/1999/xlink">
  <desc>This tests that offsets are applied correctly when zoomed.</desc>
  <filter id="offset-flood">
     <feflood flood-color="green" x="150" width="50" y="0" height="50"/>
     <feoffset  dx="20" dy="-10" />
     <fecomposite in2="SourceGraphic" operator="over"/>
  </filter>
</svg>
</body>
